<template>
  <div class="table-responsive">
    <table class="table v-middle border">
      <thead>
        <tr class>
          <th class="border-top-0">#</th>
          <th class="border-top-0">NAME</th>
          <th class="border-top-0">STATUS</th>
          <th class="border-top-0">DATE</th>
          <th class="border-top-0">PRICE</th>
          <th class="border-top-0">ACTION</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td>
            <span>Elite admin</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-success badge-pill px-2 py-1">Sale</span>
          </td>
          <td>April 18, 2017</td>
          <td>
            <h5 class="mb-0 text-success">$24</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>2</td>
          <td>
            <span>Real Homes</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-info badge-pill px-2 py-1">extended</span>
          </td>
          <td>April 19, 2017</td>
          <td>
            <h5 class="mb-0 text-info">$1250</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>3</td>
          <td>
            <span>Ample Admin</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-info badge-pill px-2 py-1">extended</span>
          </td>
          <td>April 19, 2017</td>
          <td>
            <h5 class="mb-0 text-info">$1250</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>4</td>
          <td>
            <span>Medical Pro</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-danger badge-pill px-2 py-1">Tax</span>
          </td>
          <td>April 20, 2017</td>
          <td>
            <h5 class="mb-0 text-danger">-$24</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>5</td>
          <td>
            <span>Hosting press html</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-success badge-pill px-2 py-1">Sale</span>
          </td>
          <td>April 21, 2017</td>
          <td>
            <h5 class="mb-0 text-success">$24</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>6</td>
          <td>
            <span>Digital Agency PSD</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-success badge-pill px-2 py-1">Sale</span>
          </td>
          <td>April 23, 2017</td>
          <td>
            <h5 class="mb-0 text-danger">-$14</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>7</td>
          <td>
            <span>Helping Hands</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-warning badge-pill px-2 py-1">member</span>
          </td>
          <td>April 22, 2017</td>
          <td>
            <h5 class="mb-0 text-success">$64</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
        <tr>
          <td>8</td>
          <td>
            <span>Ample Admin</span>
          </td>
          <td>
            <span class="font-weight-normal badge badge-info badge-pill px-2 py-1">extended</span>
          </td>
          <td>April 19, 2017</td>
          <td>
            <h5 class="mb-0 text-info">$1250</h5>
          </td>
          <td>
            <div class="d-flex">
              <a href="javascript:void(0)" class="text-success mr-2">
                <vs-icon icon="add_circle"></vs-icon>
              </a>
              <a href="javascript:void(0)" class="text-danger">
                <vs-icon icon="delete_sweep"></vs-icon>
              </a>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>
<script>
export default {
  name: "SalesOverview"
};
</script>